SherbyNet - /page/wikibook/entry.mu

Micron Document

<!DOCTYPE html>

<title>Dynamic HTML</title>

</head>

Dynamic HTML

</h1>

</header>

/* start https://en.wikipedia.org/ */

.mw-parser-output .ambox{border:1px solid #a2a9b1;border-left:10px solid #36c;background-color:#fbfbfb;box-sizing:border-box}.mw-parser-output .ambox+link+.ambox,.mw-parser-output .ambox+link+style+.ambox,.mw-parser-output .ambox+link+link+.ambox,.mw-parser-output .ambox+.mw-empty-elt+link+.ambox,.mw-parser-output .ambox+.mw-empty-elt+link+style+.ambox,.mw-parser-output .ambox+.mw-empty-elt+link+link+.ambox{margin-top:-1px}html body.mediawiki .mw-parser-output .ambox.mbox-small-left{margin:4px 1em 4px 0;overflow:hidden;width:238px;border-collapse:collapse;font-size:88%;line-height:1.25em}.mw-parser-output .ambox-speedy{border-left:10px solid #b32424;background-color:#fee7e6}.mw-parser-output .ambox-delete{border-left:10px solid #b32424}.mw-parser-output .ambox-content{border-left:10px solid #f28500}.mw-parser-output .ambox-style{border-left:10px solid #fc3}.mw-parser-output .ambox-move{border-left:10px solid #9932cc}.mw-parser-output .ambox-protection{border-left:10px solid #a2a9b1}.mw-parser-output .ambox .mbox-text{border:none;padding:0.25em 0.5em;width:100%}.mw-parser-output .ambox .mbox-image{border:none;padding:2px 0 2px 0.5em;text-align:center}.mw-parser-output .ambox .mbox-imageright{border:none;padding:2px 0.5em 2px 0;text-align:center}.mw-parser-output .ambox .mbox-empty-cell{border:none;padding:0;width:1px}.mw-parser-output .ambox .mbox-image-div{width:52px}@media(min-width:720px){.mw-parser-output .ambox{margin:0 10%}}@media print{body.ns-0 .mw-parser-output .ambox{display:none!important}}

/* end https://en.wikipedia.org/ */

</style>

/* start https://en.wikipedia.org/ */

.mw-parser-output .hlist dl,.mw-parser-output .hlist ol,.mw-parser-output .hlist ul{margin:0;padding:0}.mw-parser-output .hlist dd,.mw-parser-output .hlist dt,.mw-parser-output .hlist li{margin:0;display:inline}.mw-parser-output .hlist.inline,.mw-parser-output .hlist.inline dl,.mw-parser-output .hlist.inline ol,.mw-parser-output .hlist.inline ul,.mw-parser-output .hlist dl dl,.mw-parser-output .hlist dl ol,.mw-parser-output .hlist dl ul,.mw-parser-output .hlist ol dl,.mw-parser-output .hlist ol ol,.mw-parser-output .hlist ol ul,.mw-parser-output .hlist ul dl,.mw-parser-output .hlist ul ol,.mw-parser-output .hlist ul ul{display:inline}.mw-parser-output .hlist .mw-empty-li{display:none}.mw-parser-output .hlist dt::after{content:": "}.mw-parser-output .hlist dd::after,.mw-parser-output .hlist li::after{content:" · ";font-weight:bold}.mw-parser-output .hlist dd:last-child::after,.mw-parser-output .hlist dt:last-child::after,.mw-parser-output .hlist li:last-child::after{content:none}.mw-parser-output .hlist dd dd:first-child::before,.mw-parser-output .hlist dd dt:first-child::before,.mw-parser-output .hlist dd li:first-child::before,.mw-parser-output .hlist dt dd:first-child::before,.mw-parser-output .hlist dt dt:first-child::before,.mw-parser-output .hlist dt li:first-child::before,.mw-parser-output .hlist li dd:first-child::before,.mw-parser-output .hlist li dt:first-child::before,.mw-parser-output .hlist li li:first-child::before{content:" (";font-weight:normal}.mw-parser-output .hlist dd dd:last-child::after,.mw-parser-output .hlist dd dt:last-child::after,.mw-parser-output .hlist dd li:last-child::after,.mw-parser-output .hlist dt dd:last-child::after,.mw-parser-output .hlist dt dt:last-child::after,.mw-parser-output .hlist dt li:last-child::after,.mw-parser-output .hlist li dd:last-child::after,.mw-parser-output .hlist li dt:last-child::after,.mw-parser-output .hlist li li:last-child::after{content:")";font-weight:normal}.mw-parser-output .hlist ol{counter-reset:listitem}.mw-parser-output .hlist ol>li{counter-increment:listitem}.mw-parser-output .hlist ol>li::before{content:" "counter(listitem)"\a0 "}.mw-parser-output .hlist dd ol>li:first-child::before,.mw-parser-output .hlist dt ol>li:first-child::before,.mw-parser-output .hlist li ol>li:first-child::before{content:" ("counter(listitem)"\a0 "}

/* end https://en.wikipedia.org/ */

</style><style data-mw-deduplicate="TemplateStyles:r1246091330">

/* start https://en.wikipedia.org/ */

.mw-parser-output .sidebar{width:22em;float:right;clear:right;margin:0.5em 0 1em 1em;background:var(--background-color-neutral-subtle,#f8f9fa);border:1px solid var(--border-color-base,#a2a9b1);padding:0.2em;text-align:center;line-height:1.4em;font-size:88%;border-collapse:collapse;display:table}body.skin-minerva .mw-parser-output .sidebar{display:table!important;float:right!important;margin:0.5em 0 1em 1em!important}.mw-parser-output .sidebar-subgroup{width:100%;margin:0;border-spacing:0}.mw-parser-output .sidebar-left{float:left;clear:left;margin:0.5em 1em 1em 0}.mw-parser-output .sidebar-none{float:none;clear:both;margin:0.5em 1em 1em 0}.mw-parser-output .sidebar-outer-title{padding:0 0.4em 0.2em;font-size:125%;line-height:1.2em;font-weight:bold}.mw-parser-output .sidebar-top-image{padding:0.4em}.mw-parser-output .sidebar-top-caption,.mw-parser-output .sidebar-pretitle-with-top-image,.mw-parser-output .sidebar-caption{padding:0.2em 0.4em 0;line-height:1.2em}.mw-parser-output .sidebar-pretitle{padding:0.4em 0.4em 0;line-height:1.2em}.mw-parser-output .sidebar-title,.mw-parser-output .sidebar-title-with-pretitle{padding:0.2em 0.8em;font-size:145%;line-height:1.2em}.mw-parser-output .sidebar-title-with-pretitle{padding:0.1em 0.4em}.mw-parser-output .sidebar-image{padding:0.2em 0.4em 0.4em}.mw-parser-output .sidebar-heading{padding:0.1em 0.4em}.mw-parser-output .sidebar-content{padding:0 0.5em 0.4em}.mw-parser-output .sidebar-content-with-subgroup{padding:0.1em 0.4em 0.2em}.mw-parser-output .sidebar-above,.mw-parser-output .sidebar-below{padding:0.3em 0.8em;font-weight:bold}.mw-parser-output .sidebar-collapse .sidebar-above,.mw-parser-output .sidebar-collapse .sidebar-below{border-top:1px solid #aaa;border-bottom:1px solid #aaa}.mw-parser-output .sidebar-navbar{text-align:right;font-size:115%;padding:0 0.4em 0.4em}.mw-parser-output .sidebar-list-title{padding:0 0.4em;text-align:left;font-weight:bold;line-height:1.6em;font-size:105%}.mw-parser-output .sidebar-list-title-c{padding:0 0.4em;text-align:center;margin:0 3.3em}@media(max-width:640px){body.mediawiki .mw-parser-output .sidebar{width:100%!important;clear:both;float:none!important;margin-left:0!important;margin-right:0!important}}body.skin--responsive .mw-parser-output .sidebar a>img{max-width:none!important}@media screen{html.skin-theme-clientpref-night .mw-parser-output .sidebar:not(.notheme) .sidebar-list-title,html.skin-theme-clientpref-night .mw-parser-output .sidebar:not(.notheme) .sidebar-title-with-pretitle{background:transparent!important}html.skin-theme-clientpref-night .mw-parser-output .sidebar:not(.notheme) .sidebar-title-with-pretitle a{color:var(--color-progressive)!important}}@media screen and (prefers-color-scheme:dark){html.skin-theme-clientpref-os .mw-parser-output .sidebar:not(.notheme) .sidebar-list-title,html.skin-theme-clientpref-os .mw-parser-output .sidebar:not(.notheme) .sidebar-title-with-pretitle{background:transparent!important}html.skin-theme-clientpref-os .mw-parser-output .sidebar:not(.notheme) .sidebar-title-with-pretitle a{color:var(--color-progressive)!important}}@media print{body.ns-0 .mw-parser-output .sidebar{display:none!important}}

/* end https://en.wikipedia.org/ */

</style><table class="sidebar nomobile nowraplinks"><tbody><tr><th class="sidebar-title"><a href="HTML" title="HTML">HTML</a></th></tr><tr><td class="sidebar-content hlist">

<ul>

<ul><li><a href="Article_element" title="Article element">article</a></li>

<li><a href="HTML_audio" title="HTML audio">audio</a></li>

<li><a href="Canvas_element" title="Canvas element">canvas</a></li>

<li><a href="HTML_video" title="HTML video">video</a></li></ul></li>

<li><a href="XHTML" title="XHTML">XHTML</a>

<ul><li><a href="XHTML_Basic" title="XHTML Basic">Basic</a></li>

<li><a href="XHTML_Mobile_Profile" title="XHTML Mobile Profile">Mobile Profile</a></li></ul></li>

<li><a href="HTML_element" title="HTML element">HTML element</a>

<li><a href="Blink_element" title="Blink element">blink</a></li>

<li><a href="Marquee_element" title="Marquee element">marquee</a></li></ul></li>

<li><a href="HTML_attribute" title="HTML attribute">HTML attribute</a>

<ul><li><a href="Alt_attribute" title="Alt attribute">alt attribute</a></li></ul></li>

<li><a href="Frame_(World_Wide_Web)" title="Frame (World Wide Web)">HTML frame</a></li>

<li><a href="HTML_editor" title="HTML editor">HTML editor</a></li>

<li><a href="Character_encodings_in_HTML" title="Character encodings in HTML">Character encodings</a>

<ul><li><a href="List_of_XML_and_HTML_character_entity_references" title="List of XML and HTML character entity references">named characters</a></li>

<li><a href="Unicode_and_HTML" title="Unicode and HTML">Unicode</a></li></ul></li>

<li><a href="Language_code" title="Language code">Language code</a></li>

<li><a href="Document_Object_Model" title="Document Object Model">Document Object Model</a></li>

<li><a href="Browser_Object_Model" title="Browser Object Model">Browser Object Model</a></li>

<li><a href="Style_sheet_(web_development)" title="Style sheet (web development)">Style sheets</a>

<li><a href="Font_family_(HTML)" title="Font family (HTML)">Font family</a></li>

<li><a href="Web_colors" title="Web colors">Web colors</a></li>

<li><a href="JavaScript" title="JavaScript">JavaScript</a>

<ul><li><a href="WebCL" title="WebCL">WebCL</a></li>

<ul><li><a href="WebGL" title="WebGL">WebGL</a></li>

<li><a href="WebGPU" title="WebGPU">WebGPU</a></li>

<li><a href="WebXR" title="WebXR">WebXR</a></li></ul></li>

<ul><li><a href="W3C_Markup_Validation_Service" title="W3C Markup Validation Service">Validator</a></li></ul></li>

<li><a href="WHATWG" title="WHATWG">WHATWG</a></li>

<li><a href="Quirks_mode" title="Quirks mode">Quirks mode</a></li>

<li><a href="Web_storage" title="Web storage">Web storage</a></li>

<li><a href="Browser_engine" title="Browser engine">Rendering engine</a></li></ul></td>

</tr><tr><th class="sidebar-heading">

Comparisons</th></tr><tr><td class="sidebar-content hlist">

<ul><li><a href="Comparison_of_document_markup_languages" title="Comparison of document markup languages">Document markup languages</a></li>

<li><a href="Comparison_of_browser_engines" title="Comparison of browser engines">Comparison of browser engines</a></li></ul></td>

</tr><tr><td class="sidebar-navbar" style="border-top:1px solid #aaa;"><style data-mw-deduplicate="TemplateStyles:r1239400231">

/* start https://en.wikipedia.org/ */

.mw-parser-output .navbar{display:inline;font-size:88%;font-weight:normal}.mw-parser-output .navbar-collapse{float:left;text-align:left}.mw-parser-output .navbar-boxtext{word-spacing:0}.mw-parser-output .navbar ul{display:inline-block;white-space:nowrap;line-height:inherit}.mw-parser-output .navbar-brackets::before{margin-right:-0.125em;content:"[ "}.mw-parser-output .navbar-brackets::after{margin-left:-0.125em;content:" ]"}.mw-parser-output .navbar li{word-spacing:-0.125em}.mw-parser-output .navbar a>span,.mw-parser-output .navbar a>abbr{text-decoration:inherit}.mw-parser-output .navbar-mini abbr{font-variant:small-caps;border-bottom:none;text-decoration:none;cursor:inherit}.mw-parser-output .navbar-ct-full{font-size:114%;margin:0 7em}.mw-parser-output .navbar-ct-mini{font-size:114%;margin:0 4em}html.skin-theme-clientpref-night .mw-parser-output .navbar li a abbr{color:var(--color-base)!important}@media(prefers-color-scheme:dark){html.skin-theme-clientpref-os .mw-parser-output .navbar li a abbr{color:var(--color-base)!important}}@media print{.mw-parser-output .navbar{display:none!important}}

/* end https://en.wikipedia.org/ */

</style></td></tr></tbody></table>

Dynamic HTML, or DHTML, is a term which was used by some browser vendors to describe the combination of <a href="HTML" title="HTML">HTML</a>, <a href="Style_sheet_(web_development)" title="Style sheet (web development)">style sheets</a> and <a href="Dynamic_web_page#Client-side_scripting" title="Dynamic web page">client-side scripts</a> (<a href="JavaScript" title="JavaScript">JavaScript</a>, <a href="VBScript" title="VBScript">VBScript</a>, or any other supported scripts) that enabled the creation of interactive and animated documents.<a href="#cite_note-1">[1]</a><a href="#cite_note-2">[2]</a> The application of DHTML was introduced by <a href="Microsoft" title="Microsoft">Microsoft</a> with the release of <a href="Internet_Explorer_4" title="Internet Explorer 4">Internet Explorer 4</a> in 1997.<a href="#cite_note-3">[3]</a>

DHTML (Dynamic HTML) allows scripting languages, such as JavaScript, to modify variables and elements in a web page's structure, which in turn affect the look, behavior, and functionality of otherwise "static" HTML content after the page has been fully loaded and during the viewing process. Thus the dynamic characteristic of DHTML is the way it functions while a page is viewed, not in its ability to generate a unique page with each page load.

By contrast, a <a href="Dynamic_web_page" title="Dynamic web page">dynamic web page</a> is a broader concept, covering any web page generated differently for each user, load occurrence, or specific variable values. This includes pages created by client-side scripting and ones created by <a href="Server-side_scripting" title="Server-side scripting">server-side scripting</a> (such as <a href="PHP" title="PHP">PHP</a>, <a href="Python_(programming_language)" title="Python (programming language)">Python</a>, <a href="JavaServer_Pages" class="mw-redirect" title="JavaServer Pages">JSP</a> or <a href="ASP.NET" title="ASP.NET">ASP.NET</a>) where the <a href="Web_server" title="Web server">web server</a> generates content before sending it to the client.

DHTML is the predecessor of <a href="Ajax_(programming)" title="Ajax (programming)">Ajax</a> and DHTML pages are still request/reload-based. Under the DHTML model, there may not be any interaction between the client and server after the page is loaded; all processing happens on the client side. By contrast, Ajax extends features of DHTML to allow the page to initiate network requests (or 'subrequest') to the server even after page load to perform additional actions. For example, if there are multiple <a href="Tab_(interface)" title="Tab (interface)">tabs</a> on a page, the pure DHTML approach would load the contents of all tabs and then dynamically display only the one that is active, while AJAX could load each tab only when it is really needed.

DHTML allows authors to add effects to their pages that are otherwise difficult to achieve, by changing the <a href="Document_Object_Model" title="Document Object Model">Document Object Model</a> (DOM) and page style. The combination of HTML, CSS, and JavaScript offers ways to:

<ul><li>Animate text and images in their document.</li>

<li>Embed a ticker or other dynamic display that automatically refreshes its content with the latest news, stock quotes, or other data.</li>

<li>Use a form to capture user input, and then process, verify and respond to that data without having to send data back to the server.</li>

<li>Include rollover buttons or drop-down menus.</li></ul>

A less common use is to create browser-based action games. Although a number of games were created using DHTML during the late 1990s and early 2000s,<a href="#cite_note-4">[4]</a> differences between browsers made this difficult: many techniques had to be implemented in code to enable the games to work on multiple platforms. Browsers have since then converged toward <a href="Web_standards" title="Web standards">web standards</a>, which has made the design of DHTML games more viable. Those games can be played on all major browsers and in desktop and device applications that support embedded browser contexts.

The term "DHTML" has fallen out of use in recent years as it was associated with practices and conventions that tended to not work well between various web browsers.<a href="#cite_note-5">[5]</a>

DHTML support with extensive DOM access was introduced with <a href="Internet_Explorer_4.0" class="mw-redirect" title="Internet Explorer 4.0">Internet Explorer 4.0</a>. Although there was a basic dynamic system with <a href="Netscape_Navigator" title="Netscape Navigator">Netscape Navigator 4.0</a>, not all HTML elements were represented in the DOM. When DHTML-style techniques became widespread, varying degrees of support among web browsers for the technologies involved made them difficult to develop and <a href="Debug" class="mw-redirect" title="Debug">debug</a>. Development became easier when <a href="Internet_Explorer_5" title="Internet Explorer 5">Internet Explorer 5.0+</a>, <a href="Firefox" title="Firefox">Mozilla Firefox</a> 2.0+, and <a href="Opera_(web_browser)" title="Opera (web browser)">Opera</a> 7.0+ adopted a shared <a href="Document_Object_Model" title="Document Object Model">DOM</a> inherited from <a href="ECMAScript" title="ECMAScript">ECMAScript</a>.

Later, <a href="JavaScript_library" title="JavaScript library">JavaScript libraries</a> such as <a href="JQuery" title="JQuery">jQuery</a> abstracted away many of the day-to-day difficulties in cross-browser DOM manipulation, though better standards compliance among browsers has reduced the need for this.

<div class="mw-heading mw-heading2"><h2 id="Structure_of_a_web_page">Structure of a web page</h2></div>

/* start https://en.wikipedia.org/ */

.mw-parser-output .hatnote{font-style:italic}.mw-parser-output div.hatnote{padding-left:1.6em;margin-bottom:0.5em}.mw-parser-output .hatnote i{font-style:normal}.mw-parser-output .hatnote+link+.hatnote{margin-top:-0.5em}@media print{body.ns-0 .mw-parser-output .hatnote{display:none!important}}

/* end https://en.wikipedia.org/ */

</style><div role="note" class="hatnote navigation-not-searchable">See also: <a href="DOM_events" class="mw-redirect" title="DOM events">DOM events</a></div>

Typically a web page using DHTML is set up in the following way:

<head>

<title>DHTML example</title>

</head>

function init() {

let myObj = document.getElementById("navigation");

// ... manipulate myObj

}

window.onload = init;

</script>

<!--

Often the code is stored in an external file; this is done

by linking the file that contains the JavaScript.

This is helpful when several pages use the same script:

-->

</body>

</html>

</pre></div>

<div class="mw-heading mw-heading2"><h2 id="Example:_Displaying_an_additional_block_of_text">Example: Displaying an additional block of text</h2></div>

The following code illustrates an often-used function. An additional part of a web page will only be displayed if the user requests it.

<html>

<head>

<title>Using a DOM function</title>

<style>

a { background-color: #eee; }

a:hover { background: #ff0; }

#toggleMe { background: #cfc; display: none; margin: 30px 0; padding: 1em; }

</style>

</head>

<body>

<h1>Using a DOM function</h1>

<h2><a id="showhide" href="#">Show paragraph</a></h2>

<p id="toggle-me">This is the paragraph that is only displayed on request.</p>

<p>The general flow of the document continues.</p>

function changeDisplayState(displayElement, textElement) {

if (displayElement.style.display === "none" || displayElement.style.display === "") {

displayElement.style.display = "block";

textElement.innerHTML = "Hide paragraph";

} else {

}

let displayElement = document.getElementById("toggle-me");

let textElement = document.getElementById("showhide");

textElement.addEventListener("click", function (event) {

event.preventDefault();

changeDisplayState(displayElement, textElement);

});

</script>

</body>

</html>

</pre></div>

<div class="mw-heading mw-heading2"><h2 id="Document_Object_Model">Document Object Model</h2></div>

<div role="note" class="hatnote navigation-not-searchable">Main article: <a href="Document_Object_Model" title="Document Object Model">Document Object Model</a></div>

DHTML is not a technology in and of itself; rather, it is the product of three related and complementary technologies: HTML, Cascading Style Sheets (CSS), and <a href="JavaScript" title="JavaScript">JavaScript</a>. To allow scripts and components to access features of HTML and CSS, the contents of the document are represented as objects in a programming model known as the <a href="Document_Object_Model" title="Document Object Model">Document Object Model</a> (DOM).

The DOM API is the foundation of DHTML, providing a structured interface that allows access and manipulation of virtually anything in the document. The HTML elements in the document are available as a hierarchical <a href="Tree_(data_structure)" class="mw-redirect" title="Tree (data structure)">tree</a> of individual objects, making it possible to examine and modify an element and its attributes by reading and setting properties and by calling methods. The text between elements is also available through DOM properties and methods.

The DOM also provides access to user actions such as pressing a key and clicking the mouse. It is possible to intercept and process these and other events by creating <a href="Event_handler" class="mw-redirect" title="Event handler">event handler</a> functions and routines. The event handler receives control each time a given event occurs and can carry out any appropriate action, including using the DOM to change the document.

<div class="mw-heading mw-heading2"><h2 id="Dynamic_styles">Dynamic styles</h2></div>

Dynamic styles are a key feature of DHTML. By using CSS, one can quickly change the appearance and formatting of elements in a document without adding or removing elements. This helps keep documents small and the scripts that manipulate the document fast.

The object model provides programmatic access to styles. This means you can change inline styles on individual elements and change style rules using simple JavaScript programming.

Inline styles are CSS style assignments that have been applied to an element using the style attribute. You can examine and set these styles by retrieving the style object for an individual element. For example, to highlight the text in a heading when the user moves the mouse pointer over it, you can use the style object to enlarge the font and change its color, as shown in the following simple example.

<head>

<title>Dynamic Styles</title>

<style>

ul { display: none; }

</style>

</head>

<body>

<h1 id="first-header">Welcome to Dynamic HTML</h1>

<p><a id="clickable-link" href="#">Dynamic styles are a key feature of DHTML.</a></p>

<li>Change the color, size, and typeface of text</li>

</ul>

<p>We've only just begun!</p>

function showMe() {

document.getElementById("first-header").style.color = "#990000";

document.getElementById("unordered-list").style.display = "block";

}

document.getElementById("clickable-link").addEventListener("click", function (event) {

event.preventDefault();

showMe();

});

</script>

</body>

</html>

</pre></div>

<ul><li><a href="Dynamic_web_page" title="Dynamic web page">Dynamic web page</a></li></ul>

<div class="mw-heading mw-heading2"><h2 id="References">References</h2></div>

/* start https://en.wikipedia.org/ */

.mw-parser-output .reflist{margin-bottom:0.5em;list-style-type:decimal}@media screen{.mw-parser-output .reflist{font-size:90%}}.mw-parser-output .reflist .references{font-size:100%;margin-bottom:0;list-style-type:inherit}.mw-parser-output .reflist-columns-2{column-width:30em}.mw-parser-output .reflist-columns-3{column-width:25em}.mw-parser-output .reflist-columns{margin-top:0.3em}.mw-parser-output .reflist-columns ol{margin-top:0}.mw-parser-output .reflist-columns li{page-break-inside:avoid;break-inside:avoid-column}.mw-parser-output .reflist-upper-alpha{list-style-type:upper-alpha}.mw-parser-output .reflist-upper-roman{list-style-type:upper-roman}.mw-parser-output .reflist-lower-alpha{list-style-type:lower-alpha}.mw-parser-output .reflist-lower-greek{list-style-type:lower-greek}.mw-parser-output .reflist-lower-roman{list-style-type:lower-roman}

/* end https://en.wikipedia.org/ */

</style><div class="reflist">

/* start https://en.wikipedia.org/ */

.mw-parser-output cite.citation{font-style:inherit;word-wrap:break-word}.mw-parser-output .citation q{quotes:"\"""\"""'""'"}.mw-parser-output .citation:target{background-color:rgba(0,127,255,0.133)}.mw-parser-output .id-lock-free.id-lock-free a{background:url("./mw/Lock-green.svg")right 0.1em center/9px no-repeat}.mw-parser-output .id-lock-limited.id-lock-limited a,.mw-parser-output .id-lock-registration.id-lock-registration a{background:url("./mw/Lock-gray-alt-2.svg")right 0.1em center/9px no-repeat}.mw-parser-output .id-lock-subscription.id-lock-subscription a{background:url("./mw/Lock-red-alt-2.svg")right 0.1em center/9px no-repeat}.mw-parser-output .cs1-ws-icon a{background:url("./mw/Wikisource-logo.svg")right 0.1em center/12px no-repeat}body:not(.skin-timeless):not(.skin-minerva) .mw-parser-output .id-lock-free a,body:not(.skin-timeless):not(.skin-minerva) .mw-parser-output .id-lock-limited a,body:not(.skin-timeless):not(.skin-minerva) .mw-parser-output .id-lock-registration a,body:not(.skin-timeless):not(.skin-minerva) .mw-parser-output .id-lock-subscription a,body:not(.skin-timeless):not(.skin-minerva) .mw-parser-output .cs1-ws-icon a{background-size:contain;padding:0 1em 0 0}.mw-parser-output .cs1-code{color:inherit;background:inherit;border:none;padding:inherit}.mw-parser-output .cs1-hidden-error{display:none;color:var(--color-error,#d33)}.mw-parser-output .cs1-visible-error{color:var(--color-error,#d33)}.mw-parser-output .cs1-maint{display:none;color:#085;margin-left:0.3em}.mw-parser-output .cs1-kern-left{padding-left:0.2em}.mw-parser-output .cs1-kern-right{padding-right:0.2em}.mw-parser-output .citation .mw-selflink{font-weight:inherit}@media screen{.mw-parser-output .cs1-format{font-size:95%}html.skin-theme-clientpref-night .mw-parser-output .cs1-maint{color:#18911f}}@media screen and (prefers-color-scheme:dark){html.skin-theme-clientpref-os .mw-parser-output .cs1-maint{color:#18911f}}

/* end https://en.wikipedia.org/ */

</style><cite class="citation web cs1"><a rel="nofollow" class="external text" href="https://www.w3.org/DOM/faq.html#DHTML-DOM">"Document Object Model FAQ"</a>. W3C. October 22, 2003. Retrieved 2022-02-16.</cite>

</li>

<li id="cite_note-2"><a href="#cite_ref-2">^</a> <cite class="citation web cs1"><a rel="nofollow" class="external text" href="http://www.w3.org/Style/#dynamic">"Web Style Sheets"</a>. W3C. 22 July 1999. Retrieved 7 April 2018.</cite>

</li>

<li id="cite_note-3"><a href="#cite_ref-3">^</a> <cite id="CITEREFPedamkar2020" class="citation web cs1">Pedamkar, Priya (2020-07-19). <a rel="nofollow" class="external text" href="https://www.educba.com/dhtml/">"DHTML | A Quick Glance of DHTML with Components, Features, Need"</a>. EDUCBA. Retrieved 2022-10-13.</cite>

</li>

<li id="cite_note-4"><a href="#cite_ref-4">^</a> <cite id="CITEREFDownes1999" class="citation web cs1">Downes, Stephen (Aug 18, 1999). <a rel="nofollow" class="external text" href="https://www.downes.ca/post/276">"Fun and Games With DHTML"</a>. Stephen's Web. Retrieved 2022-08-27.</cite>

</li>

<li id="cite_note-5"><a href="#cite_ref-5">^</a> <cite id="CITEREFFergusonHeilmann2013" class="citation book cs1">Ferguson, Russ; Heilmann, Christian (2013). <a rel="nofollow" class="external text" href="https://link-springer-com.huaryu.kl.oakland.edu/content/pdf/10.1007/978-1-4302-5093-7.pdf">Beginning JavaScript with DOM Scripting and Ajax</a> (PDF). Berkeley, CA: Apress. pp. 49–68. <a href="Doi_(identifier)" class="mw-redirect" title="Doi (identifier)">doi</a>:<a rel="nofollow" class="external text" href="https://doi.org/10.1007%2F978-1-4302-5093-7">10.1007/978-1-4302-5093-7</a>. <a href="ISBN_(identifier)" class="mw-redirect" title="ISBN (identifier)">ISBN</a> <bdi>978-1-4302-5092-0</bdi>. <a href="S2CID_(identifier)" class="mw-redirect" title="S2CID (identifier)">S2CID</a> <a rel="nofollow" class="external text" href="https://api.semanticscholar.org/CorpusID:20526670">20526670</a>. Retrieved May 30, 2022.</cite>

</li>

</ol></div></div>

<div class="mw-heading mw-heading2"><h2 id="External_links">External links</h2></div>

/* start https://en.wikipedia.org/ */

.mw-parser-output .side-box{margin:4px 0;box-sizing:border-box;border:1px solid #aaa;font-size:88%;line-height:1.25em;background-color:var(--background-color-interactive-subtle,#f8f9fa);display:flow-root}.mw-parser-output .infobox .side-box{font-size:100%}.mw-parser-output .side-box-abovebelow,.mw-parser-output .side-box-text{padding:0.25em 0.9em}.mw-parser-output .side-box-image{padding:2px 0 2px 0.9em;text-align:center}.mw-parser-output .side-box-imageright{padding:2px 0.9em 2px 0;text-align:center}@media(min-width:500px){.mw-parser-output .side-box-flex{display:flex;align-items:center}.mw-parser-output .side-box-text{flex:1;min-width:0}}@media(min-width:720px){.mw-parser-output .side-box{width:238px}.mw-parser-output .side-box-right{clear:right;float:right;margin-left:1em}.mw-parser-output .side-box-left{margin-right:1em}}

/* end https://en.wikipedia.org/ */

</style><style data-mw-deduplicate="TemplateStyles:r1237033735">

/* start https://en.wikipedia.org/ */

@media print{body.ns-0 .mw-parser-output .sistersitebox{display:none!important}}@media screen{html.skin-theme-clientpref-night .mw-parser-output .sistersitebox img[src*="Wiktionary-logo-en-v2.svg"]{background-color:white}}@media screen and (prefers-color-scheme:dark){html.skin-theme-clientpref-os .mw-parser-output .sistersitebox img[src*="Wiktionary-logo-en-v2.svg"]{background-color:white}}

/* end https://en.wikipedia.org/ */

</style><div class="side-box side-box-right sistersitebox"><style data-mw-deduplicate="TemplateStyles:r1126788409">

/* start https://en.wikipedia.org/ */

.mw-parser-output .plainlist ol,.mw-parser-output .plainlist ul{line-height:inherit;list-style:none;margin:0;padding:0}.mw-parser-output .plainlist ol li,.mw-parser-output .plainlist ul li{margin-bottom:0}

/* end https://en.wikipedia.org/ */

</style>

<div class="side-box-text plainlist">JavaScript/DHTML</div></div>

</div>

<ul><li><a rel="nofollow" class="external text" href="http://www.quirksmode.org/">QuirksMode</a>, a comprehensive site with test examples and instructions on how to write DHTML code that runs on several browsers.</li>

<li><a rel="nofollow" class="external text" href="http://www.yourhtmlsource.com/javascript/dhtmlexplained.html">Introductory DHTML Tutorial</a></li></ul>

/* start https://en.wikipedia.org/ */

.mw-parser-output .navbox{box-sizing:border-box;border:1px solid #a2a9b1;width:100%;clear:both;font-size:88%;text-align:center;padding:1px;margin:1em auto 0}.mw-parser-output .navbox .navbox{margin-top:0}.mw-parser-output .navbox+.navbox,.mw-parser-output .navbox+.navbox-styles+.navbox{margin-top:-1px}.mw-parser-output .navbox-inner,.mw-parser-output .navbox-subgroup{width:100%}.mw-parser-output .navbox-group,.mw-parser-output .navbox-title,.mw-parser-output .navbox-abovebelow{padding:0.25em 1em;line-height:1.5em;text-align:center}.mw-parser-output .navbox-group{white-space:nowrap;text-align:right}.mw-parser-output .navbox,.mw-parser-output .navbox-subgroup{background-color:#fdfdfd}.mw-parser-output .navbox-list{line-height:1.5em;border-color:#fdfdfd}.mw-parser-output .navbox-list-with-group{text-align:left;border-left-width:2px;border-left-style:solid}.mw-parser-output tr+tr>.navbox-abovebelow,.mw-parser-output tr+tr>.navbox-group,.mw-parser-output tr+tr>.navbox-image,.mw-parser-output tr+tr>.navbox-list{border-top:2px solid #fdfdfd}.mw-parser-output .navbox-title{background-color:#ccf}.mw-parser-output .navbox-abovebelow,.mw-parser-output .navbox-group,.mw-parser-output .navbox-subgroup .navbox-title{background-color:#ddf}.mw-parser-output .navbox-subgroup .navbox-group,.mw-parser-output .navbox-subgroup .navbox-abovebelow{background-color:#e6e6ff}.mw-parser-output .navbox-even{background-color:#f7f7f7}.mw-parser-output .navbox-odd{background-color:transparent}.mw-parser-output .navbox .hlist td dl,.mw-parser-output .navbox .hlist td ol,.mw-parser-output .navbox .hlist td ul,.mw-parser-output .navbox td.hlist dl,.mw-parser-output .navbox td.hlist ol,.mw-parser-output .navbox td.hlist ul{padding:0.125em 0}.mw-parser-output .navbox .navbar{display:block;font-size:100%}.mw-parser-output .navbox-title .navbar{float:left;text-align:left;margin-right:0.5em}body.skin--responsive .mw-parser-output .navbox-image img{max-width:none!important}@media print{body.ns-0 .mw-parser-output .navbox{display:none!important}}

/* end https://en.wikipedia.org/ */

</style></div><div role="navigation" class="navbox" aria-labelledby="Web_interfaces26" style="padding:3px"><table class="nowraplinks mw-collapsible autocollapse navbox-inner" style="border-spacing:0;background:transparent;color:inherit"><tbody><tr><th scope="col" class="navbox-title" colspan="2"><div id="Web_interfaces26" style="font-size:114%;margin:0 4em"><a href="Web_API" title="Web API">Web interfaces</a></div></th></tr><tr><td colspan="2" class="navbox-list navbox-odd hlist" style="width:100%;padding:0"><div style="padding:0 0.25em"></div><table class="nowraplinks navbox-subgroup" style="border-spacing:0"><tbody><tr><td class="navbox-abovebelow" colspan="2" style="font-weight:bold"><div id="Server-side154"><a href="Server-side" class="mw-redirect" title="Server-side">Server-side</a></div></td></tr><tr><th scope="row" class="navbox-group" style="width:1%"><a href="Communication_protocol" title="Communication protocol">Protocols</a></th><td class="navbox-list-with-group navbox-list navbox-odd" style="width:100%;padding:0"><div style="padding:0 0.25em">

<li><a href="HTTPS" title="HTTPS">Encryption</a></li>

<li><a href="WebDAV" title="WebDAV">WebDAV</a></li></ul></li>

<li><a href="WebSocket" title="WebSocket">WebSocket</a></li></ul>

</div></td></tr><tr><th scope="row" class="navbox-group" style="width:1%"><a href="Server_application_programming_interface" title="Server application programming interface">Server APIs</a></th><td class="navbox-list-with-group navbox-list navbox-even" style="width:100%;padding:0"><div style="padding:0 0.25em">

<ul><li><a href="Netscape_Server_Application_Programming_Interface" title="Netscape Server Application Programming Interface">C NSAPI</a></li>

<li><a href="Apache_HTTP_Server#Feature_overview" title="Apache HTTP Server">C ASAPI</a></li>

<li><a href="Internet_Server_Application_Programming_Interface" title="Internet Server Application Programming Interface">C ISAPI</a></li>

<li><a href="Jakarta_Servlet" title="Jakarta Servlet">Jakarta Servlet</a>

<ul><li><a href="Web_container" title="Web container">container</a></li></ul></li>

<li><a href="HTTP_handler" title="HTTP handler">ASP.NET Handler</a></li>

<li><a href="Web_Server_Gateway_Interface" title="Web Server Gateway Interface">Python WSGI</a></li>

<li><a href="Asynchronous_Server_Gateway_Interface" title="Asynchronous Server Gateway Interface">Python ASGI</a></li>

<li><a href="JSGI" title="JSGI">JavaScript JSGI</a></li>

<li><a href="Java_Portlet_Specification" title="Java Portlet Specification">Portlet</a>

<ul><li><a href="Java_Portlet_Specification" title="Java Portlet Specification">container</a></li></ul></li></ul>

</div></td></tr><tr><th scope="row" class="navbox-group" style="width:1%"><a href="List_of_Apache_modules" title="List of Apache modules">Apache modules</a></th><td class="navbox-list-with-group navbox-list navbox-odd" style="width:100%;padding:0"><div style="padding:0 0.25em">

<ul><li><a href="Server_Side_Includes" title="Server Side Includes">mod_include</a></li>

<li><a href="Mod_parrot" class="mw-redirect" title="Mod parrot">mod_parrot</a></li>

<li><a href="Mod_proxy" title="Mod proxy">mod_proxy</a></li>

<li><a href="Mod_python" title="Mod python">mod_python</a></li>

<li><a href="Phusion_Passenger" title="Phusion Passenger">Phusion Passenger</a></li></ul>

</div></td></tr><tr><th scope="row" class="navbox-group" style="width:1%">Topics</th><td class="navbox-list-with-group navbox-list navbox-even" style="width:100%;padding:0"><div style="padding:0 0.25em">

<ul><li><a href="Web_service" title="Web service">Web service</a> vs. <a href="Web_resource" title="Web resource">Web resource</a></li>

<li><a href="Webhook" title="Webhook">Webhook</a></li>

<li><a href="Application_server" title="Application server">Application server</a>

<ul><li><a href="List_of_application_servers" title="List of application servers">comparison</a></li></ul></li>

<li><a href="Server-side_scripting" title="Server-side scripting">Scripting</a></li></ul>

</div></td></tr></tbody></table><div></div></td></tr><tr><td colspan="2" class="navbox-list navbox-odd hlist" style="width:100%;padding:0"><div style="padding:0 0.25em"></div><table class="nowraplinks navbox-subgroup" style="border-spacing:0"><tbody><tr><td class="navbox-abovebelow" colspan="2" style="font-weight:bold"><div id="Client-side89"><a href="Client-side" class="mw-redirect" title="Client-side">Client-side</a></div></td></tr><tr><th scope="row" class="navbox-group" style="width:1%"><a href="Plug-in_(computing)" title="Plug-in (computing)">Browser APIs</a></th><td class="navbox-list-with-group navbox-list navbox-odd" style="width:100%;padding:0"><div style="padding:0 0.25em">

<ul><li><a href="NPAPI" title="NPAPI">C NPAPI</a>

<ul><li><a href="NPAPI#LiveConnect" title="NPAPI">LiveConnect</a></li>

<li><a href="NPAPI#XPConnect" title="NPAPI">XPConnect</a></li></ul></li>

<li><a href="NPAPI#NPRuntime" title="NPAPI">C NPRuntime</a></li>

<li><a href="Google_Native_Client#Pepper" title="Google Native Client">C PPAPI</a>

<li><a href="ActiveX" title="ActiveX">ActiveX</a></li>

</div></td></tr><tr><th scope="row" class="navbox-group" style="width:1%"><a href="Web_API#Client_side" title="Web API">Web APIs</a></th><td class="navbox-list-with-group navbox-list navbox-odd" style="width:100%;padding:0"><div style="padding:0 0.25em"></div><table class="nowraplinks navbox-subgroup" style="border-spacing:0"><tbody><tr><th scope="row" class="navbox-group" style="width:1%"><a href="WHATWG" title="WHATWG">WHATWG</a></th><td class="navbox-list-with-group navbox-list navbox-even" style="width:100%;padding:0"><div style="padding:0 0.25em">

<ul><li><a href="HTML_audio" title="HTML audio">Audio</a></li>

<li><a href="Canvas_element" title="Canvas element">Canvas</a></li>

<li><a href="HTML_video" title="HTML video">Video</a></li>

<li><a href="WebSocket" title="WebSocket">WebSockets</a></li>

<li><a href="Web_Messaging" title="Web Messaging">Web messaging</a></li>

<li><a href="Web_storage" title="Web storage">Web storage</a></li>

<li><a href="Web_worker" title="Web worker">Web worker</a></li>

<li><a href="XMLHttpRequest" title="XMLHttpRequest">XMLHttpRequest</a></li></ul>

</div></td></tr><tr><th scope="row" class="navbox-group" style="width:1%"><a href="World_Wide_Web_Consortium" title="World Wide Web Consortium">W3C</a></th><td class="navbox-list-with-group navbox-list navbox-odd" style="width:100%;padding:0"><div style="padding:0 0.25em">

<ul><li><a href="DOM_event" title="DOM event">DOM events</a></li>

<li><a href="W3C_Geolocation_API" title="W3C Geolocation API">Geolocation</a></li>

<li><a href="Indexed_Database_API" title="Indexed Database API">IndexedDB</a></li>

<li><a href="WebAssembly" title="WebAssembly">WebAssembly</a></li>

<li><a href="WebAuthn" title="WebAuthn">WebAuthn</a></li>

<li><a href="WebGPU" title="WebGPU">WebGPU</a></li>

<li><a href="WebRTC" title="WebRTC">WebRTC</a></li>

<li><a href="WebXR" title="WebXR">WebXR</a></li></ul>

</div></td></tr><tr><th scope="row" class="navbox-group" style="width:1%"><a href="Khronos_Group" title="Khronos Group">Khronos</a></th><td class="navbox-list-with-group navbox-list navbox-even" style="width:100%;padding:0"><div style="padding:0 0.25em">

<ul><li><a href="WebCL" title="WebCL">WebCL</a></li>

<li><a href="WebGL" title="WebGL">WebGL</a></li></ul>

</div></td></tr><tr><th scope="row" class="navbox-group" style="width:1%">Others</th><td class="navbox-list-with-group navbox-list navbox-odd" style="width:100%;padding:0"><div style="padding:0 0.25em">

<ul><li><a href="Gears_(software)" title="Gears (software)">Gears</a></li>

<li><a href="Web_SQL_Database" title="Web SQL Database">Web SQL Database</a> (formerly W3C)</li>

<li><a href="WebUSB" title="WebUSB">WebUSB</a></li></ul>

</div></td></tr></tbody></table><div></div></td></tr><tr><th scope="row" class="navbox-group" style="width:1%">Topics</th><td class="navbox-list-with-group navbox-list navbox-even" style="width:100%;padding:0"><div style="padding:0 0.25em">

<ul><li><a href="Ajax_(programming)" title="Ajax (programming)">Ajax</a> and <a href="Remote_scripting" title="Remote scripting">Remote scripting</a> vs. </li>

<li><a href="Browser_extension" title="Browser extension">Browser extension</a></li>

<li><a href="Cross-site_scripting" title="Cross-site scripting">Cross-site scripting</a> and <a href="Cross-origin_resource_sharing" title="Cross-origin resource sharing">CORS</a></li>

<li><a href="Hydration_(web_development)" title="Hydration (web development)">Hydration</a></li>

<li><a href="Mashup_(web_application_hybrid)" title="Mashup (web application hybrid)">Mashup</a></li>

<li><a href="Client-side_persistent_data" title="Client-side persistent data">Persistent data</a></li>

<li><a href="Dynamic_web_page#Client-side_scripting" title="Dynamic web page">Scripting</a></li></ul>

<ul><li><a href="Frontend_and_backend" title="Frontend and backend">Frontend and backend</a></li>

<li><a href="Microservices" title="Microservices">Microservices</a>

<li><a href="GraphQL" title="GraphQL">GraphQL</a></li></ul></li>

<li><a href="Push_technology" title="Push technology">Push technology</a></li>

<li><a href="Solution_stack" title="Solution stack">Solution stack</a></li>

<ul><li><a href="Static_web_page" title="Static web page">Static</a></li>

<li><a href="Dynamic_web_page" title="Dynamic web page">Dynamic</a></li></ul></li>

<li><a href="Web_standards" title="Web standards">Web standards</a></li>

<li><a href="Web_API_security" title="Web API security">Web API security</a></li>

<li><a href="Web_application" title="Web application">Web application</a>

<li><a href="Single-page_application" title="Single-page application">Single-page</a></li>

<li><a href="Progressive_web_app" title="Progressive web app">Progressive</a></li></ul></li>

<li><a href="Web_framework" title="Web framework">Web framework</a></li></ul>

</div></td></tr></tbody></table><div></div></td></tr></tbody></table></div>

<div class="navbox-styles"></div><div role="navigation" class="navbox" aria-labelledby="ECMAScript584" style="padding:3px"><table class="nowraplinks hlist mw-collapsible autocollapse navbox-inner" style="border-spacing:0;background:transparent;color:inherit"><tbody><tr><th scope="col" class="navbox-title" colspan="2"><div id="ECMAScript584" style="font-size:114%;margin:0 4em"><a href="ECMAScript" title="ECMAScript">ECMAScript</a></div></th></tr><tr><th scope="row" class="navbox-group" style="width:1%">Dialects</th><td class="navbox-list-with-group navbox-list navbox-odd" style="width:100%;padding:0"><div style="padding:0 0.25em">

<ul><li><a href="ActionScript" title="ActionScript">ActionScript</a>

<li><a href="JavaScript" title="JavaScript">JavaScript</a>

<ul><li><a href="JavaScript_engine" class="mw-redirect" title="JavaScript engine">engines</a></li>

<li><a href="JScript" title="JScript">JScript</a></li>

<li><a href="JScript_.NET" title="JScript .NET">JScript .NET</a></li>

<li><a href="QtScript" title="QtScript">QtScript</a></li>

<li><a href="TypeScript" title="TypeScript">TypeScript</a></li>

<li><a href="WMLScript" title="WMLScript">WMLScript</a></li></ul>

</div></td></tr><tr><th scope="row" class="navbox-group" style="width:1%"><a href="List_of_JavaScript_engines" title="List of JavaScript engines">Engines</a> (list)</th><td class="navbox-list-with-group navbox-list navbox-even" style="width:100%;padding:0"><div style="padding:0 0.25em">

<ul><li><a href="Presto_(browser_engine)#ECMAScript_engines" title="Presto (browser engine)">Carakan</a></li>

<li><a href="Presto_(browser_engine)#ECMAScript_engines" title="Presto (browser engine)">Futhark</a></li>

<li>InScript</li>

<li><a href="WebKit#JavaScriptCore" title="WebKit">JavaScriptCore</a></li>

<li><a href="JScript" title="JScript">JScript</a></li>

<li><a href="Presto_(browser_engine)#ECMAScript_engines" title="Presto (browser engine)">Linear B</a></li>

<li><a href="QtScript" title="QtScript">QtScript</a></li>

<li><a href="Rhino_(JavaScript_engine)" title="Rhino (JavaScript engine)">Rhino</a></li>

<li><a href="SpiderMonkey" title="SpiderMonkey">SpiderMonkey</a>

<ul><li><a href="SpiderMonkey#TraceMonkey" title="SpiderMonkey">TraceMonkey</a></li>

<li><a href="SpiderMonkey#JägerMonkey" title="SpiderMonkey">JägerMonkey</a></li></ul></li>

<li><a href="Tamarin_(software)" title="Tamarin (software)">Tamarin</a></li>

<li><a href="Chakra_(JavaScript_engine)" title="Chakra (JavaScript engine)">ChakraCore</a>

<ul><li><a href="Chakra_(JScript_engine)" title="Chakra (JScript engine)">Chakra</a></li></ul></li>

<li><a href="JScript_.NET" title="JScript .NET">JScript .NET</a></li>

<li><a href="Nashorn_(JavaScript_engine)" title="Nashorn (JavaScript engine)">Nashorn</a></li></ul>

</div></td></tr><tr><th scope="row" class="navbox-group" style="width:1%"><a href="Software_framework" title="Software framework">Frameworks</a></th><td class="navbox-list-with-group navbox-list navbox-odd" style="width:100%;padding:0"><div style="padding:0 0.25em"></div><table class="nowraplinks navbox-subgroup" style="border-spacing:0"><tbody><tr><th scope="row" class="navbox-group" style="width:1%"><a href="Client-side_JavaScript" class="mw-redirect" title="Client-side JavaScript">Client-side</a></th><td class="navbox-list-with-group navbox-list navbox-odd" style="width:100%;padding:0"><div style="padding:0 0.25em">

<li><a href="Google_Web_Toolkit" title="Google Web Toolkit">Google Web Toolkit</a></li>

<li><a href="JQuery" title="JQuery">jQuery</a></li>

<li><a href="Lively_Kernel" title="Lively Kernel">Lively Kernel</a></li>

<li>midori</li>

<li><a href="MochiKit" title="MochiKit">MochiKit</a></li>

<li><a href="MooTools" title="MooTools">MooTools</a></li>

<li><a href="Prototype_JavaScript_Framework" title="Prototype JavaScript Framework">Prototype</a></li>

<li><a href="Qooxdoo" title="Qooxdoo">qooxdoo</a></li>

<li><a href="SproutCore" title="SproutCore">SproutCore</a></li>

<li>Wakanda Framework</li></ul>

</div></td></tr><tr><th scope="row" class="navbox-group" style="width:1%"><a href="Server-side_JavaScript" class="mw-redirect" title="Server-side JavaScript">Server-side</a></th><td class="navbox-list-with-group navbox-list navbox-even" style="width:100%;padding:0"><div style="padding:0 0.25em">

<li><a href="Jaxer" class="mw-redirect" title="Jaxer">Jaxer</a></li>

<li><a href="AppJet" title="AppJet">AppJet</a></li>

<li>WakandaDB</li></ul>

</div></td></tr><tr><th scope="row" class="navbox-group" style="width:1%">Multiple</th><td class="navbox-list-with-group navbox-list navbox-odd" style="width:100%;padding:0"><div style="padding:0 0.25em">

<ul><li>Cappuccino</li></ul>

</div></td></tr><tr><th scope="row" class="navbox-group" style="width:1%"><a href="JavaScript_library" title="JavaScript library">Libraries</a></th><td class="navbox-list-with-group navbox-list navbox-even" style="width:100%;padding:0"><div style="padding:0 0.25em">

<ul><li><a href="Backbone.js" title="Backbone.js">Backbone.js</a></li>

<li><a href="SWFObject" title="SWFObject">SWFObject</a></li>

<li><a href="Underscore.js" title="Underscore.js">Underscore.js</a></li></ul>

</div></td></tr></tbody></table><div></div></td></tr><tr><th scope="row" class="navbox-group" style="width:1%">People</th><td class="navbox-list-with-group navbox-list navbox-odd" style="width:100%;padding:0"><div style="padding:0 0.25em">

<ul><li><a href="Brendan_Eich" title="Brendan Eich">Brendan Eich</a></li>

<li><a href="Douglas_Crockford" title="Douglas Crockford">Douglas Crockford</a></li>

<li><a href="John_Resig" title="John Resig">John Resig</a></li>

<li>Scott Isaacs</li></ul>

</div></td></tr><tr><th scope="row" class="navbox-group" style="width:1%">Other</th><td class="navbox-list-with-group navbox-list navbox-even" style="width:100%;padding:0"><div style="padding:0 0.25em">

<ul>

<li><a href="Ecma_International" title="Ecma International">Ecma International</a></li>

<li><a href="JSDoc" title="JSDoc">JSDoc</a></li>

<li><a href="JSHint" title="JSHint">JSHint</a></li>

<li><a href="JSLint" title="JSLint">JSLint</a></li>

<li><a href="Sputnik_(JavaScript_conformance_test)" title="Sputnik (JavaScript conformance test)">Sputnik</a></li>

<li><a href="Browser_speed_test" class="mw-redirect" title="Browser speed test">SunSpider</a></li>

<li><a href="Asynchronous_module_definition" title="Asynchronous module definition">Asynchronous module definition</a></li>

<li><a href="CommonJS" title="CommonJS">CommonJS</a></li></ul>

</div></td></tr><tr><td class="navbox-abovebelow" colspan="2"><div> Lists: <a href="List_of_JavaScript_libraries" title="List of JavaScript libraries">JavaScript libraries</a> • <a href="List_of_Ajax_frameworks#JavaScript" title="List of Ajax frameworks">Ajax frameworks</a> • <a href="List_of_server-side_JavaScript_implementations" title="List of server-side JavaScript implementations">Server-side JavaScript</a> Comparison: <a href="Comparison_of_JavaScript-based_web_frameworks" title="Comparison of JavaScript-based web frameworks">JavaScript web frameworks</a></div></td></tr></tbody></table></div>

/* start https://en.wikipedia.org/ */

.mw-parser-output .tooltip-dotted{border-bottom:1px dotted;cursor:help}

/* end https://en.wikipedia.org/ */

</style></div><div role="navigation" class="navbox authority-control" aria-labelledby="Authority_control_databases_frameless&#124;text-top&#124;10px&#124;alt=Edit_this_at_Wikidata&#124;link=https&#58;//www.wikidata.org/wiki/Q380153#identifiers&#124;class=noprint&#124;Edit_this_at_Wikidata1185" style="padding:3px"><table class="nowraplinks hlist mw-collapsible autocollapse navbox-inner" style="border-spacing:0;background:transparent;color:inherit"><tbody><tr><th scope="col" class="navbox-title" colspan="2"><div id="Authority_control_databases_frameless&#124;text-top&#124;10px&#124;alt=Edit_this_at_Wikidata&#124;link=https&#58;//www.wikidata.org/wiki/Q380153#identifiers&#124;class=noprint&#124;Edit_this_at_Wikidata1185" style="font-size:114%;margin:0 4em">Authority control databases </div></th></tr><tr><th scope="row" class="navbox-group" style="width:1%">National</th><td class="navbox-list-with-group navbox-list navbox-odd" style="width:100%;padding:0"><div style="padding:0 0.25em"><ul><li><a rel="nofollow" class="external text" href="https://id.loc.gov/authorities/sh97008021">United States</a></li><li><a rel="nofollow" class="external text" href="https://catalogue.bnf.fr/ark:/12148/cb13572286g">France</a></li><li><a rel="nofollow" class="external text" href="https://data.bnf.fr/ark:/12148/cb13572286g">BnF data</a></li><li><a rel="nofollow" class="external text" href="https://aleph.nkp.cz/F/?func=find-c&local_base=aut&ccl_term=ica=ph347580&CON_LNG=ENG">Czech Republic</a></li><li><a rel="nofollow" class="external text" href="https://datos.bne.es/resource/XX546727">Spain</a></li><li><a rel="nofollow" class="external text" href="https://www.nli.org.il/en/authorities/987007549195705171">Israel</a></li></ul></div></td></tr><tr><th scope="row" class="navbox-group" style="width:1%">Other</th><td class="navbox-list-with-group navbox-list navbox-even" style="width:100%;padding:0"><div style="padding:0 0.25em"><ul><li><a rel="nofollow" class="external text" href="https://lux.collections.yale.edu/view/concept/43420fb3-ecfe-4936-a202-b8b1451cafc9">Yale LUX</a></li></ul></div></td></tr></tbody></table></div></div><div><div class="zim-footer">

This article is issued from <a class="external text" title="Last edited on 2025-04-25" href="https://en.wikipedia.org/wiki/?title=Dynamic_HTML&oldid=1287362083">Wikipedia</a>. The text is available under <a class="external text" href="https://creativecommons.org/licenses/by-sa/4.0/deed.en">Creative Commons Attribution-Share Alike 4.0</a> unless otherwise noted. Additional terms may apply for the media files.

</div>

</div></div>

</div>

</main>

</div>

</body></html>